<template>
  <div class="title-underline"
      :style="{
        background: `linear-gradient(to right, transparent, ${strokeColor}, transparent)`
      }"
  ></div>
</template>

<script>
export default {
  name: 'DecorativeDivider',
  props: {
    strokeColor: {
      type: String,
      required: false,
      default: '#00baff'
    }
  }
}
</script>

<style scoped>
.title-underline {
  height: 2px;
  margin-top: 11px;
  margin-bottom: 11px;
  border-radius: 5px;
  opacity: 0.6;
}
</style>
